<script type="text/template" id="cc-pie-chart">

    <div ref="chart" style="height: 600px"></div>

</script>
<script>
    Vue.component('cc-pie-chart', {
        template: '#cc-pie-chart',
        props: ['options'],
        data() {
            return {}
        },
        methods: {
            initCanvas: function () {
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(this.$refs.chart);
//                var dom = document.getElementById("container");
//                var myChart = echarts.init(dom);
                console.log(JSON.stringify(this.options))
                myChart.setOption(this.options, true);
            },
        },

        mounted: function () {
            this.initCanvas();
        },
        watch: {
            options: {
                deep: true,
                handler: function (newVal, oldVal) {
                    if (newVal) {
                        this.initCanvas();
                    }
                }
            }
        },
        computed: {}
    })
</script>

